<template>
    <div style="width: 100%;height: 100%">
        <dv-scroll-board @mouseover="mouseover" :config="config" style="width:100%;height:85%" />
    </div>
</template>
<script>
export default {
    data() {
        return {
            config: {
                rowNum: 8,
                header: ['表号', '金额', '类型', '状态'],
                headerBGC: 'transparent',
                oddRowBGC: 'transparent',
                evenRowBGC: 'transparent',
                align: ['center', 'center', 'center', 'center'],
                data: [],
                columnWidth: [170, 150]
            }
        }
    },
    props: {
        data: {
            type: Array,
            default: []
        },
        header: {
            type: Array,
            default: []
        }
    },
    watch: {
        data: {
            handler(val) {
                this.config.data = val
            },
            immediate: true,
        },
        header: {
            handler(val) {
                this.config.header = val
            },
            immediate: true,
        }
    },
    methods: {
        mouseover(e) {
            console.log(e);
            if (e.ceil.indexOf('30002') > 0) {
                console.log('在1分钟内,您只能进行一次充值操作。');
            } else if (e.ceil.indexOf('30003') > 0) {
                console.log('每月累计充值金额最多1.00元, 还可充值1.00元');
            } else if (e.ceil.indexOf('30004') > 0) {
                console.log('当天充值已达上限, 请明天充值!');
            } else if (e.ceil.indexOf('30005') > 0) {
                console.log('跟据您的用电习惯, 剩余电量充足, 此次无需充值!');
            } else if (e.ceil.indexOf('30006') > 0) {
                console.log('单次充值限额0.0元');
            } else if (e.ceil.indexOf('30007') > 0) {
                console.log('设备充值人数过多, 请明天重试!');
            } else {
                console.log('null');
            }
        }
    }
}
</script>

<style lang="scss" scoped> /deep/ .dv-scroll-board {
     position: absolute;
     bottom: 0;
     left: 50%;
     transform: translate(-50%, 0);
 }
</style>